.pxToRem(@p, @px) {
    @{p}: @px / 75 * 1rem;
}
a{
    text-decoration: none !important;
}
.head{
     width:100%;
    position: fixed;
    left: 0;
    top: 0;
    .pxToRem(height, 105);
    background: #b59969;
    display: flex;
   align-items: center;
    justify-content:space-between;
    z-index: 99;
    .left{
          .pxToRem(margin-left, 30);
    }
   
     .right{
        .pxToRem(width, 185);
       .pxToRem(line-height, 90);
        background: #c6ae82;
        text-align: center;
         .pxToRem(padding, 20);
    }
     
  span{
            color: #FFFDEF;
        .pxToRem(font-size, 35);
   
    }
    

}



 .ul{   
        position: fixed;
    left: 0;
    top: 0;
          width: 100%;
        position: fixed;
      .pxToRem(top,95); 
        
        left: 0;
        border-bottom: 2px solid #d2d2d2;
        background: #f6f6f6;
        z-index: 99;
        .top {
           
            width: 100%;
            .topone {
                .pxToRem(height, 80);
                display: flex;
                justify-content: center;
                align-items: center;
                box-sizing: border-box;
                width: 100%;
                div {
                    flex: 1;
                    height: 100%;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    a {
                        width: 80%;
                        height: 100%;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        color: #000;
                        box-sizing: border-box;
                        .pxToRem(font-size, 28);
                        text-decoration: none;
                       
                    }
                    .zx {
                        
                        border-bottom: 4px solid #b69967;
                        color: #b69967;
                    }
                }
            }
        }
}

   body{
     height: 100vh;
     background:#f6f6f6;
   } 

.bottom{
    width: 100%;
 
.pxToRem(margin-top,20);
background:linear-gradient(180deg,#f3dab6,#f6f6f6);
    .one{

        width: 100%;
        display: flex;
        align-items: center;
        flex-direction: column;
         .pxToRem(margin-top,200);
         p{
             &:last-child{
                 border-top:none ;
             }
             background: #f6f6f6;
             .pxToRem(width,650);
              display: flex;
              align-items: center;
              justify-content: center;
               border: 1px solid #B69967;
            box-sizing: border-box;
            
        span{
            display: flex;
              align-items: center;
              justify-content: center;
           .pxToRem(width,110);
            .pxToRem(height,110);
           color: #b69976;
            .pxToRem(font-size,60);
                       }
            input{
                 background: #f6f6f6;
                flex: 1;
            height:100%;
            border: none;
            .pxToRem(font-size,30);
           
            }
        
    }  
    
}
            



   .tow{
//      
        width: 100%;
        display: flex;
        align-items: center;
        flex-direction: column;
         .pxToRem(margin-top,200);
         p{
             &:last-child{
                 border-top:none ;
             }
             
             .pxToRem(width,650);
              background: #f6f6f6;
              display: flex;
              align-items: center;
              justify-content: center;
               border: 1px solid #B69967;
            box-sizing: border-box;
            
        span{
            display: flex;
              align-items: center;
              justify-content: center;
           .pxToRem(width,110);
            .pxToRem(height,110);
           color: #b69976;
            .pxToRem(font-size,60);
                       }
            input{
                 background: #f6f6f6;
                flex: 1;
            height:100%;
            border: none;
            .pxToRem(font-size,30);
           
            }
        
    }  
    
} 
}

.main{
 
    .pxToRem(margin-top,50);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    .dl{
        
         .pxToRem(width,650);
          .pxToRem(height,90); 
          background: #b69976;
          color: #fff;
          .pxToRem(font-size,30);
    }
    .zi{
        .pxToRem(margin-top,30);
        color: #b69976;
        .pxToRem(letter-spacing,3);
    }  
}
.foot{
 
    width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
    flex-direction: column;
    position: fixed;
    bottom:2%;
    
   p{
        .pxToRem(letter-spacing,5);
   }
   .sc{
       width: 100%;
        display: flex;
   align-items: center;
   justify-content: center;
    .pxToRem(margin-top,10);
   dl{
     width: 40%;
    display: flex;
   align-items: center;
   justify-content: center;
    flex-direction: column;
       dt{
          width: 50%;
          text-align: center;
          img{
              width:70%;
          }
       }
       dd{
          .pxToRem(margin-top,10); 
       }
   }
}
}